import React, { Component } from 'react'

export default class Test extends Component {
    state = {
        value: ""
    }
    /*
        * JS中的||符号：
        1、运算方法：
            只要“||”前面为false,不管“||”后面是true还是false，都返回“||”后面的值。
            只要“||”前面为true,不管“||”后面是true还是false，都返回“||”前面的值。
        2、总结：真前假后

        * throw语句会抛出一个错误。当错误发生时， JavaScript 会停止执行并抛出错误信息。
    */
    render() {
        const value = this.state.value;
        if(/^[a-zA-Z]+$/.test(value) || value===""){
            return <input type="text" placeholder="只能填写字母" value={value} onChange={this.changeFn.bind(this)} />
        }
        // throw new Error('出错了！');
        // return <h2>出错了！！</h2>;
    }
    changeFn(e){
        this.setState({
            value: e.currentTarget.value
        })
    }
}